﻿@using Wlog.Web.Code.Classes;
@using Wlog.Web.Models;
@model Wlog.Web.Models.DashboardModel

@{
    Layout = "~/Views/Shared/_LayoutInternal.cshtml";
}
 



<div class="row">
    <div class="col-lg-12">
        <h1 class="page-header">Dashboard</h1>
    </div>
    <!-- /.col-lg-12 -->
</div>
<!-- /.row -->
<div class="row">
    <div class="col-lg-3 col-md-6">
        <div class="panel panel-primary">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-xs-3">
                        <i class="fa fa-comments fa-5x"></i>
                    </div>
                    <div class="col-xs-9 text-right">
                        <div class="huge">@Model.LogCount</div>
                        <div>Total log count</div>
                    </div>
                </div>
            </div>
            <a href="#">
                <div class="panel-footer">
                    @*<span class="pull-left">View Details</span>
                    <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>*@
                    <div class="clearfix"></div>
                </div>
            </a>
        </div>
    </div>
    <div class="col-lg-3 col-md-6">
        <div class="panel panel-green">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-xs-3">
                        <i class="fa fa-tasks fa-5x"></i>
                    </div>
                    <div class="col-xs-9 text-right">
                        <div class="huge">@Model.InfoCount</div>
                        <div>Infos</div>
                    </div>
                </div>
            </div>
            <a href="#">
                <div class="panel-footer">
                    @*<span class="pull-left">View Details</span>
                    <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>*@
                    <div class="clearfix"></div>
                </div>
            </a>
        </div>
    </div>
    <div class="col-lg-3 col-md-6">
        <div class="panel panel-yellow">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-xs-3">
                        <i class="fa fa-shopping-cart fa-5x"></i>
                    </div>
                    <div class="col-xs-9 text-right">
                        <div class="huge">@Model.WarnCount</div>
                        <div>Warnings</div>
                    </div>
                </div>
            </div>
            <a href="#">
                <div class="panel-footer">
                    @*<span class="pull-left">View Details</span>
                    <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>*@
                    <div class="clearfix"></div>
                </div>
            </a>
        </div>
    </div>
    <div class="col-lg-3 col-md-6">
        <div class="panel panel-red">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-xs-3">
                        <i class="fa fa-support fa-5x"></i>
                    </div>
                    <div class="col-xs-9 text-right">
                        <div class="huge">@Model.ErrorCount</div>
                        <div>Errors</div>
                    </div>
                </div>
            </div>
            <a href="#">
                <div class="panel-footer">
                    @*<span class="pull-left">View Details</span>
                    <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>*@
                    <div class="clearfix"></div>
                </div>
            </a>
        </div>
    </div>
</div>
<!-- /.row -->
<div class="row">
    <div class="col-lg-8">
       
        <div id="morris-area-chart"></div>
        @foreach(MessagesListModel app in Model.AppLastTen)
        {

        <!-- /.panel -->
        <div class="panel panel-default">
            <div class="panel-heading">
                <i class="fa fa-bar-chart-o fa-fw"></i>@app.ApplicationName
                @*<div class="pull-right">
                    <div class="btn-group">
                        <button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown">
                            Actions
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu pull-right" role="menu">
                            <li>
                                <a href="#">Action</a>
                            </li>
                            <li>
                                <a href="#">Another action</a>
                            </li>
                            <li>
                                <a href="#">Something else here</a>
                            </li>
                            <li class="divider"></li>
                            <li>
                                <a href="#">Separated link</a>
                            </li>
                        </ul>
                    </div>
                </div>*@
            </div>
            <!-- /.panel-heading -->
            <div class="panel-body">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="table-responsive">
                            <table class="table table-bordered table-hover table-striped">
                                <thead>
                                    <tr>
                                       
                                        <th>Date</th>
                                        <th>Level</th>
                                        <th>Message</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach (var row in app.Messages)
                                    {
                                        <tr>
                                            <td>@row.SourceDate</td>
                                            <td>@row.Level</td>                                           
                                            <td>@row.Message</td>
                                        </tr>
                                    }
                                </tbody>
                            </table>

                          
                                <a href="/private/Logs?applicationId=@app.IdApplication"  class="btn btn-default btn-block"> All @app.ApplicationName logs</a>
                           
                        </div>
                        <!-- /.table-responsive -->
                    </div>
                    <!-- /.col-lg-4 (nested) -->
                    <div class="col-lg-8">
                        <div id="morris-bar-chart"></div>
                    </div>
                    <!-- /.col-lg-8 (nested) -->
                </div>
                <!-- /.row -->
            </div>
            <!-- /.panel-body -->
        </div>
        }
    </div>
    <!-- /.col-lg-8 -->
    <div class="col-lg-4">
        <div class="panel panel-default">
            <div class="panel-heading">
                <i class="fa fa-bell fa-fw"></i> Last Messages
            </div>
            <!-- /.panel-heading -->
            <div class="panel-body">
                <div class="list-group">

                    @foreach (var log in Model.LastTen)
                    {
                    <a href="#" class="list-group-item">
                        @if (log.Level == null)
                        {
                            <i class="fa fa-comment fa-fw"></i>
                        }
                        else if (log.Level.ToLower().StartsWith("err"))
                        {
                            <i class="fa fa-exclamation-circle  fa-fw"></i>
                        }
                        else if (log.Level.ToLower().StartsWith("info"))
                        {
                            <i class="fa fa-info  fa-fw"></i>
                        }
                        else if (log.Level.ToLower().StartsWith("warn"))
                        {
                            <i class="fa fa-exclamation-triangle  fa-fw"></i>
                        }
                        else
                        {
                            <i class="fa fa-comment fa-fw"></i>
                        }                         @log.SourceDate - @log.Message
                        <span class="pull-right text-muted small">
                            <em>@(DateTime.Now.Subtract(log.SourceDate).TotalMinutes) minutes ago</em>
                        </span>
                    </a>
                    }
                </div>
                <!-- /.list-group -->
                <a href="/private/logs" class="btn btn-default btn-block">View All Logs</a>
            </div>
            <!-- /.panel-body -->
        </div>
        
    </div>
    <!-- /.col-lg-4 -->
</div>
<!-- /.row -->


<script>

    $(function () {

        Morris.Line({
            element: 'morris-area-chart',
            data: [
                @for(int i=0;i< Model.QueueLoad.Count;i++)
                {
                    var ql = Model.QueueLoad[i];
                                       <text>
                           
                       {time: '@ql.Time.ToString("yyyy-MM-dd HH:mm:ss")',
                           load:  @ql.QueueSize}
                       //max: @ql.MaxSize}
                  </text>

                    if (Model.QueueLoad.Count - 1 > i)
                    {
                        <text>,</text>
                    }
                }
        ],
            xkey: 'time',
            //ykeys: ['load', 'max'],
            ykeys: ['load'],
            //labels: ['load', 'max'],
            labels: ['load'],
            pointSize: 2,
            hideHover: 'auto',
            resize: true
        });
    });
</script>